# Верстка блока с иллюстрацией для статьи о Монреале

### Реализация

#### В песочнице CodePen

Перед началом работы сделайте форк пена на [https://codepen.io/Netology/pen/RYOryB](https://codepen.io/Netology/pen/RYOryB?editors=1000#0). Вносите изменения только во вкладке HTML.

##### Внимание: Общую структуру документа создавать не надо, вкладка Codepen «HTML» работает, как тег `<body>`
см. [инструкцию по работе с Codepen](https://github.com/netology-code/guides/tree/master/codepen).

---

## Описание

В качестве второго тестового задания вы должны доработать верстку статьи о Монреале.
Вам прислали верстку контента статьи, которая выглядит следующим образом:

![](https://netology-code.github.io/html-2-homeworks/sources/1-2/montreal-task.jpg)

От вас требуется добавить в текст блок с иллюстрацией и правильно оформить изображение и подпись к нему. Итоговый результат должен соответствовать макету:

![](https://netology-code.github.io/html-2-homeworks/sources/1-2/montreal-result.jpg)

## Процесс реализации

1. После первого абзаца добавьте элемент `figure`.
2. Внутри элемента `figure` добавьте изображение. В качестве источника изображения используйте
`https://netology-code.github.io/html-2-homeworks/content-tags/montreal-illustration/img/220px-St.JamesSt.-Montreal_-1910.jpg`.

3. Для изображения добавьте альтернативный текст “Монреаль начала XX века”.
4. Создайте подпись к элементу `figure` с текстом “Улица Сен-Жак в 1910 году”.
5. Убедитесь, что результат соответствует описанию. Для этого перейдите в режим FullPage ([скриншот](/sources/screen.md)). Если режим FullPage View выдал ошибку — вам нужно подтвердить свою учетную запись в codepen, пройдя по ссылке из письма, пришедшего от codepen, тогда все должно начать работать корректно.

